﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-touch-fullscreen" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no,email=no" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover" />
    <meta name="applicable-device" content="mobile" />

    <style type="text/css">
        * { margin: 0; padding: 0; font-family: "微软雅黑",system-ui, serif; font-size: 16px; }
        body { font-family: system-ui, serif; }
        img { border-style: none }
        li { list-style: none; float: left }
        a { text-decoration: none }


    </style>
</head>

<body>
    <div id="app">
        <div style="height: 100vh; width:100%;">
            <div style=" height:100vh; width: 150px; float:left; border-right:1px solid #ccc;">
                111
            </div>
            <div style=" height:100vh; width:calc(100% - 150px - 2px); float:left;">
                main
            </div>
        </div>


        <!-- <van-sidebar v-model="active" style="height: 100vh;">
            <template v-for="item in 50" :key="item">
                <van-sidebar-item>
                    <template #title>
                        标签{{item}}
                    </template>
                </van-sidebar-item>
            </template>
        </van-sidebar>
        <div>
            <van-button type="primary">主要按钮</van-button>
            <van-button type="success">成功按钮</van-button>
            <van-button type="default">默认按钮</van-button>
            <van-button type="warning">警告按钮</van-button>
            <van-button type="danger">危险按钮</van-button>
        </div> -->
    </div>
</body>

</html> 